Skip to content

feat: Editor as directive#342

Open
javiermarinros wants to merge 4 commits intotinymce:mainfrom
ideatic:editor-directive
Open

feat: Editor as directive#342
javiermarinros wants to merge 4 commits intotinymce:mainfrom
ideatic:editor-directive

Conversation

@javiermarinros
Copy link

@javiermarinros javiermarinros commented Feb 7, 2023

I separated the Editor component logic into a directive and a component that inherits from it.

With this change, the directive can be directly attached to a host element like a textarea without having to create custom nodes.

Example:

<textarea editor [(ngModel)]="text"
   [init]="{
     height: 500,
     menubar: false,
     plugins: [
       'advlist autolink lists link image charmap print preview anchor',
       'searchreplace visualblocks code fullscreen',
       'insertdatetime media table paste code help wordcount'
     ],
     toolbar:
       'undo redo | formatselect | bold italic backcolor | \
       alignleft aligncenter alignright alignjustify | \
       bullist numlist outdent indent | removeformat | help'
   }"
></textarea>

It should be compatible with all previous implementations, as the component have the same inputs and outputs as it used to have, and the directive has mostly the same API as the component, except for the id and tagName inputs.

@javiermarinros javiermarinros requested a review from a team as a code owner February 7, 2023 01:39
@javiermarinros javiermarinros requested review from EkimChau, jscasca and tiny-james and removed request for a team February 7, 2023 01:39
@tiny-james tiny-james requested review from a team, TheSpyder, ltrouton, shanmen-tiny and tiny-ben-tran and removed request for a team, EkimChau, jscasca and tiny-james March 22, 2023 00:13
@danoaky-tiny
Copy link
Contributor

danoaky-tiny commented Jan 15, 2024 •
edited
Loading

Hi @javiermarinros, thanks for putting in the time to make this PR.

I think it's an interesting idea and novel. In my opinion though I think it's quite narrow in its use case.
A directive to me should be able to be used across a variety of elements, whereas this one can only be used on a textarea. The changes it makes to the textarea is quite substantial as well, giving more support to the idea that it's a full blown component and should look as such in the template it's used.
It should also be said that it does add more complexity in having a directive that the component now uses and a whole relationship there that wasn't needed before.

That's my thoughts on it for now. If others think differently or if there's significant want/need for this in the future we'll certainly consider it.

@javiermarinros javiermarinros requested a review from a team as a code owner January 15, 2024 09:06
@javiermarinros javiermarinros requested review from vpyshnenko and removed request for a team January 15, 2024 09:06
@javiermarinros
Copy link
Author

javiermarinros commented Jan 15, 2024

Hi @danoaky-tiny thank you for your review. Just some remarks:

  • It can be used with any element with [editor] attribute, not only textareas.
  • The relationship between the Component and the Directive is quite simple, as the component inherits all the code from the directive using OOP. The Component code is actually quite simple.
  • They are marked as standalone, following the latest Angular trends. This is completely transparent and compatible for code bases still using Angular modules.
  • The PR also resolves some strange code patterns, such as the use of an empty template in the controller: template: '<ng-template></ng-template>'

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@TheSpyder TheSpyder Awaiting requested review from TheSpyder TheSpyder was automatically assigned from tinymce/editor-platform-team

@ltrouton ltrouton Awaiting requested review from ltrouton ltrouton was automatically assigned from tinymce/editor-platform-team

@tiny-ben-tran tiny-ben-tran Awaiting requested review from tiny-ben-tran tiny-ben-tran was automatically assigned from tinymce/editor-platform-team

@shanmen-tiny shanmen-tiny Awaiting requested review from shanmen-tiny shanmen-tiny was automatically assigned from tinymce/editor-platform-team

@vpyshnenko vpyshnenko Awaiting requested review from vpyshnenko vpyshnenko is a code owner automatically assigned from tinymce/tinymce-reviewers

At least 2 approving reviews are required to merge this pull request.

Assignees

No one assigned

Labels

Community PR

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@javiermarinros @danoaky-tiny @TheSpyder